import { defineStore } from 'pinia'
import { useCookies } from '@vueuse/integrations/useCookies'
import { store } from '../index'

const cookies = useCookies(['locale'])

export const useAppStore = defineStore({
  id: 'app',
  state: () => ({
    version: '1.0.0',
    mobile: false,
    mobileShow: false,
    collapse: cookies.get('sidebarStatus') || false
  }),
  getters: {
    getVersion() {
      return this.version
    },
    getMobile() {
      return this.mobile
    },
    getMobileShow() {
      return this.mobileShow
    },
    getCollapse() {
      return this.collapse
    }
  },
  actions: {
    toogleSidebar() {
      if (this.mobile && !this.mobileShow) {
        this.setMobileShow(true)
        return
      }
      this.setCollapse(!this.collapse)
    },
    setCollapse(collapse) {
      this.collapse = collapse
      cookies.set('sidebarStatus', collapse)
    },
    setMobile(mobile) {
      this.mobile = mobile
    },
    setMobileShow(show) {
      this.mobileShow = show
    }
  }
})

export const useAppStoreWithOut = () => {
  return useAppStore(store)
}
